<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>前后端分离开发平台</title>
    <link rel="icon" href="assets/images/favicon.ico"/>
    <link rel="stylesheet" href="assets/libs/layui/css/layui.css">
    <link rel="stylesheet" href="assets/common.css">
</head>

<body>
<div class="login-logo">
    <img src="assets/images/logo.png">
    <cite>EasyWeb</cite>
</div>
<div class="login-form">
    <div class="title">前后端分离开发平台</div>
    <form class="layui-form" action="">
        <div class="layui-form-item">
            <input name="username" type="text" class="layui-input" placeholder="账号" lay-verify="required" required/>
        </div>
        <div class="layui-form-item">
            <input name="password" type="password" class="layui-input" placeholder="密码" lay-verify="required" required/>
        </div>
        <div class="layui-form-item">
            <button class="layui-btn" lay-filter="loginSubmit" lay-submit>&emsp;登录&emsp;</button>
            <button type="reset" class="layui-btn layui-btn-primary">&emsp;重置&emsp;</button>
        </div>
    </form>
</div>

<script type="text/javascript" src="assets/libs/layui/layui.js"></script>
<script type="text/javascript" src="assets/common.js"></script>
<script>
    layui.use(['jquery', 'layer', 'form', 'admin'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var form = layui.form;
        var admin = layui.admin;

        if (admin.getToken()) {
            goIndex();
        }

        // 监听表单提交
        form.on('submit(loginSubmit)', function (data) {
            doLogin(data.field);
            return false;
        });

        // 使用密码模式登录
        function doLogin(field) {
            field.grant_type = 'password';
            field.scope = 'DEFAULT';
            field.client_id = '397fd05f-3bfd-4205-a641-aaf0f8522744';
            field.client_secret = '2777e2f6-60a7-4a92-b02b-be92b52ab763';
            layer.load(2);
            $.ajax({
                url: '/oauth/token',
                data: field,
                type: 'POST',
                dataType: 'JSON',
                success: function (data) {
                    layer.closeAll('loading');
                    if (data.access_token) {
                        admin.putToken(data);
                        layer.msg('登录成功', {icon: 1, time: 1500}, function () {
                            goIndex();
                        });
                    } else {
                        layer.msg('登录失败，请重试', {icon: 5});
                    }
                },
                error: function (xhr) {
                    layer.closeAll('loading');
                    if (xhr.status == 400) {
                        layer.msg('账号或密码错误', {icon: 5});
                    } else {
                        layer.msg('登录失败，请查看console信息', {icon: 5});
                    }
                }
            });
        }

        function goIndex() {
            location.replace('index.html');
        }
    });
</script>
</body>
</html>